<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<link rel="stylesheet" type="text/css" href="../../../css/app.css">
		<link rel="stylesheet" type="text/css" href="../../../css/tabBar.css">
		<link rel="stylesheet" type="text/css" href="../../../css/swiper.min.css" />
		<link rel="stylesheet" type="text/css" href="./css/shop_add.css">

		<link rel="stylesheet" href="../comm/mui.min.css">
		<link rel="stylesheet" type="text/css" href="../comm/mui.picker.min.css">
		<title>添加商品</title>
	</head>

	<body>
		<div class="vue-content" v-cloak>
			<div class="header navigationBar">
				<div class="wrapper">
					<span id="btn-back" class="header-btn left-btn backtrack" @click="close"></span>
					<span class="title" v-if="edit != 1">添加商品</span>
					<span class="title" v-if="edit == 1">编辑商品</span>
					<span id="btn-save" v-if="edit == 1" class="right-btn" @click="saveOrEditGoods">保存</span>
				</div>
			</div>
			<div class="container top-container">
				<div class="swiper-container shop_add_top">
					<div class="swiper-wrapper" id="shopAddImgSlider" :class="{'bigger':bigger}">
						<!-- <div class="swiper-wrapper" id="shopAddImgSlider"> -->
						<div class="swiper-slide" v-for="item in swiperImageArr">
							<img :src="item+'?x-oss-process=image/resize,m_lfit,w_960'" />

						</div>
					</div>
					<div v-if="swiperImageArr.length" class="swiper-pagination"></div>
					<!-- <div class="shop_card_show" v-for="item in imgarr">
                      <img :src="item"/>
                      <span><img src="../../../image/shop/buy/buy-44.png"/></span>
                      <p @click="addLink">添加商品链接</p>
                    </div> -->
					<div class="shop_add_imgMain shop_add_file" :class="{'small':small}" @click="openImgManage()">

						<img src="../../../image/shop/shop-add.png" />
						<p v-if="!small">添加图片</p>
						<p v-if="!small">（为了图片展示效果，建议上传比例为1:1的图片3张以上）</p>
					</div>
					<!-- <input ref="goodsImg" class="goodsImg" type="file" accept="image/png,image/jpeg,image/gif" name="" id="" value="" /> -->

				</div>
				<div class="titleTextarea">
					<textarea ref="goodsName" name="" maxlength='30' rows="0" cols="0" v-model="titleContent" class="shop_add_text goodsName" placeholder="请填写商品标题" v-html="goodsList.name"></textarea>
					<span class="restrictNum"> <span v-html="textNum"></span> /30 </span>
				</div>



				<div v-if="!isGroup">
					<div class="shop_add_list" id="shopAddList" ref="shopAddList" v-for="(item, index) in templateList">
						<div class="shop_add_ul" :class="(templateList.length-1) ? '' : 'shop_add_goods'">
							<ul>
								<li class="kill_price_class"><span>秒杀价格</span><input type="number" v-model="killPrice[index]" ref="killPrice" name="" value="" placeholder="请填写商品秒杀价格(元)" /></li>

								<li><span>价格</span><span class="require">*</span><input type="number" v-model="goodsPrice[index]" ref="goodsPrice" name="" value="" placeholder="请填写商品价格(元)" /></li>
								<!-- <li><span>原价</span><span class="require">*</span><input type="number" v-model="marketPrice[index]" ref="marketPrice" name="" value="" placeholder="选填商品市场价格(元)" /></li> -->
								<li v-if="yzcTag"><span>YZC</span><span class="require">*</span><input type="number" v-model="yzcPrice[index]" ref="yzcPrice" name="" value="" placeholder="选填商品的YZC的兑换数量" /></li>
								<li><span>型号</span><span class="require">*</span><input type="text" v-model="goodsSpec[index]" name="" value="" placeholder="请填写商品型号" /></li>
								<li><span>库存</span><span class="require">*</span><input type="number" v-model="goodsNum[index]" name="" value="" placeholder="请填写商品库存" /></li>
								<!-- <li><span>编码</span><input type="number" v-model="goodsCode[index]" name="" value="" placeholder="选填，用于系统商家对接"/></li> -->
								<li class="img_select" @click="openImgSelect(index)">
									<span>上传图片</span><span class="require">*</span>
									<i class="aui-iconfont aui-icon-right"></i>
									<img :src="imgSpec[index]" alt="">
								</li>
							</ul>
							<a href="javascript:void(0);" class="shop_add_list_del" v-if="(templateList.length-1)" @click="addModelDel(index)"></a>
						</div>
					</div>
				</div>
				<div v-else>
					<div class="shop_add_list" id="shopAddList" ref="shopAddList" v-for="(item, index) in templateList">
						<div class="shop_add_ul" :class="(templateList.length-1) ? '' : 'shop_add_goods'">
							<ul>
								<li class="kill_price_class"><span>秒杀价格</span><input type="number" v-model="killPrice[index]" ref="killPrice" name="" value="" placeholder="请填写商品秒杀价格(元)" /></li>
								<li><span>拼团价格</span><span class="require">*</span><input type="number" v-model="groupPrice[index]" name="" value="" placeholder="请填写拼团价格(元)" /></li>
								<li><span>拼团人数</span><span class="require">*</span>
									<!-- <input type="number" v-model="groupNum[index+1]" name="" value="" placeholder="请填写拼团人数"/> -->
									<div><u @click="groupNumSelect(index)" ref="causeSelectDom" class="reason_tag" v-html="reason_tag[index]">请选择</u></div>
								</li>
								<li><span>价格</span><span class="require">*</span><input type="number" v-model="goodsPrice[index]" ref="goodsPrice" name="" value="" placeholder="请填写原价格(元)" /></li>
								<!-- <li><span>原价</span><span class="require">*</span><input type="number" v-model="marketPrice[index]" ref="marketPrice" name="" value="" placeholder="选填商品市场价格(元)" /></li> -->
								<li v-if="yzcTag"><span>YZC</span><span class="require">*</span><input type="number" v-model="yzcPrice[index]" ref="yzcPrice" name="" value="" placeholder="选填商品的YZC的兑换数量" /></li>
								<li><span>型号</span><span class="require">*</span><input type="text" v-model="goodsSpec[index]" name="" value="" placeholder="请填写商品型号" /></li>
								<li><span>库存</span><span class="require">*</span><input type="number" v-model="goodsNum[index]" name="" value="" placeholder="请填写商品库存" /></li>
								<!-- <li><span>编码</span><input type="number" v-model="goodsCode[index]" name="" value="" placeholder="选填，用于系统商家对接"/></li> -->
								<li class="img_select" @click="openImgSelect(index)">
									<span>上传图片</span><span class="require">*</span>
									<i class="aui-iconfont aui-icon-right"></i>
									<img :src="imgSpec[index]" alt="">
								</li>
							</ul>
							<a href="javascript:void(0);" class="shop_add_list_del" v-if="(templateList.length-1)" @click="addModelDel(index)"></a>
						</div>
					</div>
				</div>
				<!-- <add-model v-on:addModelDel1="addModelDel"></add-model> -->

				<div class="shop_add_list_add" @click="addGoods">
					<i class="aui-iconfont aui-icon-plus"></i>添加商品型号
				</div>



				<div class="batch_classfiy" @click="close_batch_classfiy">
					<div class="batch_classfiy_main" @click.stop>
						<h2>分类至（按分类展示商品，方便买家筛选）</h2>
						<ul class="batch_classfiy_list">
							<li v-for="item in classfiyList">
								<label>
			  					<input class="aui-radio" :checked="category_id == item.category_id ? 'checked' : ''" @click="getCategory(item.category_id)" type="radio" name="classifyName" :value="item.category_id" ><span v-html='item.name'></span>
		  					</label>
							</li>
						</ul>
						<a class="batch_new_classfiy" href="javascript: void(0);" @click="newClassfiy"><i class=""></i>新建分类</a>
						<div class="batch_classfiy_btn">
							<div>
								<a href="javascript:void(0);" @click="classfiyCancel">取消</a>
							</div>
							<div>
								<a href="javascript:void(0);" @click="classfiySure()">确定</a>
							</div>
						</div>
					</div>
				</div>

				<div class="batch_classfiy3" @click="close_batch_classfiy3">
					<div class="batch_classfiy_main" @click.stop>
						<h2>选择运费模版</h2>
						<ul class="batch_classfiy_list">
							<li v-for="item in dispatchList">
								<label>
			  					<input class="aui-radio" :checked="dispatch_id == item.template_id ? 'checked' : ''" @click="getDispatch(item.template_id)" type="radio" name="dispatchName" :value="item.template_id">
									<span v-html='item.name'></span>
									<span class="additional">(默认：首重{{item.first_weight}}内{{item.first}}元，每增重{{item.additional_weight}}kg{{item.additional}}元)</span>
		  					</label>
							</li>
						</ul>
						<div class="batch_classfiy_btn">
							<div>
								<a href="javascript:void(0);" @click="dispatchCancel">取消</a>
							</div>
							<div>
								<a href="javascript:void(0);" @click="dispatchSure()">确定</a>
							</div>
						</div>
					</div>
				</div>

				<div class="order_refuse_cause" data-name="拼团人数选择" ref="orderRefuseCause">
					<div class="refuse_cause_bg" @click="close_order_refuse_cause"></div>
					<div class="refuse_cause_main">
						<h2>请选择拼团人数</h2>
						<ul>
							<li>
								<label for="two">
                  <input type="radio" id='two' name="groupNum" v-model="picked" class="aui-radio" value="2" />
                  <span>2人</span>
                </label>
							</li>
							<li>
								<label for="three">
                  <input type="radio" id='three' name="groupNum" v-model="picked" class="aui-radio" value="3" />
                  <span>3人</span>
                </label>
							</li>
						</ul>
						<a href="javascript:void(0);" @click="selectGroupNumConfirm">确定</a>
					</div>
				</div>

				<ul class="shop_add_detail">
					<li @click="goodsDetail">
						<span>商品详情</span>
						<i class="aui-iconfont aui-icon-right"></i>
					</li>

					<li @click="goodsClassfiy">
						<span>分类</span>
						<i class="aui-iconfont aui-icon-right"></i>
						<span class="cat_name" v-html="cat_name"></span>
					</li>
					<li>
						<span class="service">服务承诺</span>
						<ul class="service_div">
							<li>
								<label for="genuine" style="width: 30vw;"><input type="checkbox" id="genuine" v-model="genuine" class="switch" >正品保证</label>
							</li>
							<!-- <li>
                  <label for="speed_return" style="width: 30vw;"><input type="checkbox" id="speed_return" v-model="speed_return" class="switch" >极速退款</label>
                </li> -->
							<li>
								<label for="seven_reason"><input type="checkbox" id="seven_reason" v-model="seven_reason" class="switch" >7天无理由退换</label>
							</li>
						</ul>
					</li>
			</ul>

			<div class="goodsButton1" v-if="goodsList == ''">
				<div class="saveButton" @click="saveOrEditGoods">
					发布商品
				</div>

				<div class="add_rules">
					<label>
              <input type="checkbox" name="ruleCheck" checked>我已阅读并同意
            </label>
					<span @click="openAddRules">《发布商品规则》</span>
				</div>
			</div>

			<div class="goodsButton" v-if="goodsList != ''">
				<div class="offButton" v-if="goodsList != '' && on_sale == 1" @click="offButton(goodsList.goods_id)">
					下架
				</div>
				<div class="onButton" v-if="goodsList != '' && on_sale == 0" @click="onButton(goodsList.goods_id)">
					上架
				</div>
				<div class="delButton" v-if="goodsList != ''" @click="delButton(goodsList.goods_id)">
					删除
				</div>
			</div>

		</div>
		</div>
	</body>

	<script src="../../sea.js" data-main="../../main"></script>
	<script type="text/javascript" src="../../vue.js"></script>
	<script type="text/javascript" src="../../mui.js"></script>
	<script type="text/javascript" src="../../mui.picker.min.js"></script>
	<!-- <script type="text/javascript" src="../../layui.all.js"></script> -->
	<script type="text/javascript" src="./js/shopAdd.js"></script>

</html>
